<template>
  <span>{{ item }}: {{ fn() }}</span>
</template>

<script>
export default {
  props: {
    item: {
      type: Number,
    },
    flag: {
      type: Boolean,
    },
    digit: {
      type: Number,
    },
  },
  methods: {
    fn() {
      if (this.item === this.digit) {
        if (this.flag === true) {
          return "答对了";
        } else if (this.flag === false) {
          return "答错了";
        }
      } else {
        return "未完成";
      }
    },
  },
};
</script>

<style scoped>
.right {
  color: green;
}
.error {
  color: red;
}
.undo {
  color: #ccc;
}
</style>
